<template>
	<view>
		<view class="cu-bar search bg-white">
			<view class="search-form round">
				<text class="cuIcon-search"></text>
				<input @input="shuju" v-model="searchs" type="text" placeholder="搜索" confirm-type="search"></input>
			</view>
			<view class="quxiao" @click="back">取消</view>
		</view>
		<view v-if="searchs" class="list" v-for="(item, index) in messList" :key='index' @click="detailsData(item.friend_id)">
			<image class="head" :src="item.avatar || '../../static/image/bg_img.png'"></image>
			<view class="list_con">
				<view class="name flexs">{{item.nickname}}</view>
				<view class="content">{{item.content}}</view>
			</view>
			<view class="topa_right">{{item.createtime}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				searchs: '',
				messList:[],
				stus:''
			}
		},
		onShow() {
			this.$msgchat.initwork();
		},
		onLoad(option) {
			this.stus = option.TabCur;
		},
		methods: {
			//返回上一级
			back() {
				uni.navigateBack();
			},
			shuju(e){
				console.log(e.detail.value)
				let that = this;
				var type = '';
				if(this.stus == 0){
					type = 1
				}else if(this.stus == 1){
					type = 2
				}
				var obj = {
					search : e.detail.value,
					type : type
				}
				this.$common.requests('/api/Chatlist/chatlist', obj).then(res => {
					uni.hideNavigationBarLoading();
					uni.stopPullDownRefresh(); //得到数据后停止下拉刷新
					res.data.data.forEach((key, index) => {
						if (key.avatar != '' && key.avatar != null) {
							key.avatar = that.$common.baseUrl + key.avatar;
						}
					});
					this.messList = res.data.data;
					console.log(this.messList);
				})
			},
			detailsData(friend_id){
				uni.navigateTo({
					url:'../detailsData/detailsData?friend_id='+friend_id
				})
			}
		}
	}
</script>

<style>
	page {
		width: 100vw;
		height: 100vh;
		background: #F5F4F9;
	}

	.bg-white {
		padding-top: 50upx;
		background: #F5F4F9;
	}

	.round {
		border-radius: 10upx !important;
		background: #FFF;
		height: 80upx;
	}

	.quxiao {
		margin-right: 30upx;
	}

	.list {
		width: 100%;
		padding:15upx 30upx;
		margin: 20upx 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background: #FFF;
	}

	.head {
		width: 110upx;
		height: 110upx;
		border-radius: 50%;
	}

	.list_con {
		width: 70%;
	}
	.content{
		font-size: 30upx;
		color: #797979;
		padding-top: 15upx;
	}
	.topa_right {
		font-size: 28upx;
		color: #797979;
	}
</style>
